<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div class="ui inverted segment footerDiv" th:fragment="footer-content">
    <div class="ui container">
        <div class="ui stackable inverted divided grid" align="center">
            <div class="four wide column">
                <h4 class="ui inverted header">联系我呀</h4>
                <img class="ui small rounded image" th:src="#{web_Wechat}" />
            </div>
            <div class="four wide column">
                <h4 class="ui inverted header">技术支持</h4>
                <div class="ui animated inverted  list">
                    <a href="https://semantic-ui.com" rel="nofollow" target="_blank" class="item">Semantic UI</a>
                    <a href="https://spring.io/"  rel="nofollow" target="_blank" class="item">Spring</a>
                    <a href="https://redis.io/"  rel="nofollow" target="_blank"  class="item">Redis</a>
                    <a href="https://mybatis.org/mybatis-3/" rel="nofollow"  target="_blank"  class="item">Mybatis</a>
                </div>
            </div>
            <div class="four wide column">
                <h4 class="ui inverted header">学习网站</h4>
                <div class="ui animated inverted  list">
                    <a href="https://github.com/" rel="nofollow" target="_blank" class="item">Github</a>
                    <a href="https://www.bilibili.com/" rel="nofollow"  target="_blank" class="item">BiliBili</a>
                    <a href="https://www.mooc.cn/" rel="nofollow"  target="_blank"  class="item">MOOC</a>
                    <a href="https://gitee.com/" rel="nofollow" target="_blank" class="item">Gitee</a>

                </div>
            </div>
            <div class="four wide column">
                <h4 class="ui inverted header">博主寄诗</h4>
                <div class="ui inverted  list">
                    <h4 class="ui inverted header m-text-thin m-text-spaced ">虞美人·李煜</h4>
                    <p class="m-text-thin m-text-spaced m-opacity-mini">
                        春花秋月何时了，往事知多少？小楼昨夜又东风，故国不堪回首月明中！</p>
                    <p class="m-text-thin m-text-spaced m-opacity-mini">
                        雕阑玉砌应犹在，只是朱颜改。问君能有几多愁？恰似一江春水向东流。</p>
                </div>
            </div>
        </div>
        <div class="ui inverted divider"></div>
        <div class="ttl" align="center">网站已运行: <span id="webRuntime" class="item m-text-thin"></span> (*๓´╰╯`๓)</div>
        <div class="copyRight" align="center">Copyright © 2022-Now isbut.cn All Rights Reserved.</div>
    </div>
    <script src="/js/semantic.min.js"></script>
    <script src="/js/moment.min.js" type="text/javascript"></script>

    <script>
        setInterval(setTime, 1000);
    </script>

    <script type="text/javascript" src="/js/canvas-ribbon.js"></script>
    <script type="text/javascript">
        new Ribbons({
            // ribbon color HSL saturation amount
            colorSaturation: "80%",
            // ribbon color HSL brightness amount
            colorBrightness: "50%",
            // ribbon color opacity amount
            colorAlpha: 0.6,
            // how fast to cycle through colors in the HSL color space
            colorCycleSpeed: 10,
            // where to start from on the Y axis on each side (top|min, middle|center, bottom|max, random)
            verticalPosition: "center",
            // how fast to get to the other side of the screen
            horizontalSpeed: 0.8,
            // how many ribbons to keep on screen at any given time
            ribbonCount: 2,
            // add stroke along with ribbon fill colors
            strokeSize: 0,
            // move ribbons vertically by a factor on page scroll
            parallaxAmount: 0,
            // add animation effect to each ribbon section over time
            animateSections: true
        });
    </script>
    <!--用户自定义js-->

</div>
</body>
</html>